<template>
  <a-col flex="auto">
    <a-card :bordered="false" style="margin-bottom: 10px">
      <!-- 查询区域 -->
      <div class="table-page-search-wrapper">
        <a-form-model layout="inline" ref="ruleForm" :model="queryParam">
          <z-form-item :datas="fieldArr" :form="queryParam" :gutter="8" :toggle="toggleSearchStatus">
            <a-col :span="4" slot="submit-action">
              <a-space :size="6">
                <a-button type="primary" @click="onQuery" icon="search">查询</a-button>
                <a-button @click="onResetForm" icon="reload">重置</a-button>
              </a-space>
            </a-col>
          </z-form-item>
        </a-form-model>
      </div>
    </a-card>
    <a-card :bordered="false">
      <!-- 操作按钮区域 -->
      <div class="table-operator">
        <div>
          <a-button>新增活动</a-button>
        </div>
      </div>
      <!-- 表格展示 -->
      <div class="table-page-content">
        <z-table
          ref="table"
          rowKey="id"
          :showAlert="false"
          :showSelection="true"
          :loading="loading"
          :columns="columns"
          :dataSource="pageData"
          @selectedRow="onSelectedRow"
          @change="onTableChange"
        >
          <!--操作-->
          <template slot="action" slot-scope="text, record">
            <a-button @click="handleDetails(record)" type="link" style="padding:0;">查看</a-button>
          </template>
        </z-table>
      </div>
      <!--弹窗区域-->
    </a-card>
  </a-col>
</template>

<script>
import {PrisonList} from './activity'
export default {
  name: "list",
  mixins:[PrisonList],
  data() {
    return {
      labelCol: { span: 8 },
      wrapperCol: { span: 16 },
      rangePickerTime: [],
      show: false,
      closeTip: false,
      loading: false,
      visible: false,
      handleModalBool: false,
      isDisabled: true,
      reloading: false,
      toggle: true,
      selectKeys: [],
      form: {},
      queryParam: {},
      handleModalTitle: null,
      /* 查询折叠 */
      toggleSearchStatus:false,
      fieldArr: [
        {label: '小组编号', prop: 'suspectAccountName', tagType: 'input', span: 5},
        {label: '小组名称', prop: 'suspectAccountNumber', tagType: 'input', span: 5},
        {label: '活动类型', prop: 'suspccountType', tagType: 'dict-select', dictCode:'sex', span: 5},
        {label: '执行情况', prop: 'suspeccountType', tagType: 'dict-select', dictCode:'sex', span: 5},
      ],
      columns: [
        {
          title: '在线状态',
          width: 60,
          align: 'center',
          dataIndex: 'taskCode',
          customRender: text => {
            return <j-ellipsis value={text} length={20} />
          }
        },
        {
          title: '姓名',
          dataIndex: 'taskName',
          width: 80,
          align: 'center',
          customRender: text => {
            return <j-ellipsis value={text} length={14} />
          }
        },
        {
          title: '身份证号',
          dataIndex: 'incidentCode',
          width: 110,
          align: 'left',
          customRender: text => {
            return <j-ellipsis value={text} length={20} />
          }
        },
        {
          title: '类型',
          dataIndex: 'incidentName',
          width: 60,
          align: 'center',
          customRender: text => {
            return <j-ellipsis value={text} length={14} />
          }
        },
        {
          title: '联系电话',
          dataIndex: 'name',
          width: 80,
          align: 'center'
        },
        {
          title: '执行地区',
          dataIndex: 'labelAddress',
          width: 100,
          align: 'center',
          customRender: text => {
            return <j-ellipsis value={text} length={14} />
          }
        },
        {
          title: '登录状态',
          dataIndex: 'loginStatus',
          width: 80,
          align: 'center'
        },
        {
          title: '登录时间',
          dataIndex: 'labelName',
          width: 100,
          align: 'center',
          customRender: text => {
            return <j-ellipsis value={text} length={14} />
          }
        },
        {
          title: '执行情况',
          dataIndex: 'status',
          width: 80,
          align: 'center'
        },
        {
          title: '操作',
          width: 120,
          align: 'center',
          dataIndex: 'action',
          scopedSlots: { customRender: 'action' }
        }
      ],
      pageFilter: {
        pageNo: 1,
        pageSize: 10
      },
      pageData: {}
    }
  },
  methods:{
    onQuery() {
      // this.pageFilter.pageNo = 1
      // this.refreshTable()
    },
    handleDetails(record) {
      this.handleModalTitle = '任务详情'
      this.$refs.intellDetailModalRef.show(record)
    },
  }
}
</script>

<style scoped>

</style>